import { Component } from 'vue-facing-decorator'
import Render from '@/render/Render'
import toNative from '@/utils/toNative'
import TableRender, { type TableRenderColumnTypes } from '@/render/TableRender'
import type { VxeColumnSlotTypes } from 'vxe-table'
import type { ReportCaseResultDto } from '@/api/insurance/period/types'

@Component
export class OperateView extends TableRender {
    noTablePadding = true
    noFilterPadding = true
	
    tableColumnConfigOld = () => [
        {
            field: 'id',
            title:'操作属性'
        },{
            field: 'id',
            title:'操作人次'
        },{
            field: 'id',
            title:'方案简称'
        },{
            field: 'id',
            title:'扣款时间'
        }
    ] as TableRenderColumnTypes<ReportCaseResultDto>
	
    filterConfig() {
        return {
            companyId: {
                name: '扣费日期',
                element: 'datetime',
            }
        }
    }
    render() { 
        return (
            <div class="h-full flex flex-col">
                <div class="flex-none">
                    {this.renderFilter()}
                </div>
                <div class="flex-1">
                    {this.renderTable()}
                </div>
                <div class="flex-none">
                    {this.renderPager()}
                </div>
            </div>
        )
    }
}

export default toNative<{}, {}>(OperateView)